<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
    <meta name="apple-mobile-web-app-capable" content="yes"/>
    <meta name="apple-mobile-web-app-status-bar-style" content="black"/>
    <meta name="format-detection" content="telephone=no,email=no"/>
    <title>兑换记录</title>
    <link rel="stylesheet" href="../css/style.css"/>
</head>
<body>
<div class="wrap">
    <div class="header">
        <span class="ui-icon icon-back"><a href="index.html" class="block"></a></span>

        <h1>我的兑换</h1>
    </div>
    <div class="page">
        <div class="exchange-list">
            <div class="exchange-item">
                <a href="javascript:;" class="block">
                    <div class="e-img"><img src="http://lorempixel.com/350/200"/></div>
                    <h2>2000积分兑换50元话费</h2>
                    <div class="good-cost">
                        <span class="coin">22000</span>
                        <span class="sep"></span>
                        <span class="price">2599<i>￥</i></span>
                    </div>
                    <div class="t-small">2016-02-10 15:10</div>
                    <div class="s-expand s-collapse"></div>
                    <!--展开则加上 s-collapse 样式名，收起去除s-collapse样式-->
                </a>
                <div class="exchange-more">
                    <span class="arr"></span>
                    <div class="exchange-recipient">
                        <ul>
                            <li>收件人：张三</li>
                            <li>手机：12345567890</li>
                            <li>送货地址：中国广东广州天河珠江新城花城大道花城大道花城大道</li>
                            <li>状态：<span class="state">未送货</span></li>
                        </ul>
                    </div>
                </div>
            </div>
            <div class="exchange-item">
                <a href="javascript:;" class="block">
                    <div class="e-img"><img src="http://lorempixel.com/350/200"/></div>
                    <h2>2000积分兑换50元话费</h2>
                    <div class="good-cost">
                        <span class="coin">22000</span>
                        <span class="sep"></span>
                        <span class="price">2599<i>￥</i></span>
                    </div>
                    <div class="t-small">2016-02-10 15:10</div>
                    <div class="s-expand"></div>
                    <!--展开则加上 s-collapse 样式名-->
                </a>
                <div class="exchange-more">
                    <span class="arr"></span>
                    <!--该订单无效，已取消……纯文字显示-->
                    <h2>编号：</h2>
                    <h2 class="msg-text">ABCDEF101001</h2>
                </div>
            </div>
            <div class="exchange-item">
                <a href="javascript:;" class="block">
                    <div class="e-img"><img src="http://lorempixel.com/350/200"/></div>
                    <h2>2000积分兑换50元话费</h2>
                    <div class="good-cost">
                        <span class="coin">22000</span>
                        <span class="sep"></span>
                        <span class="price">2599<i>￥</i></span>
                    </div>
                    <div class="t-small">2016-02-10 15:10</div>
                    <div class="s-expand"></div>
                    <!--展开则加上 s-collapse 样式名-->
                </a>
                <div class="exchange-more">
                    <span class="arr"></span>
                    <!--订单后续操作-->
                    <div class="action">
                        <h2>暂无收货人信息</h2>
                        <div class="exchange-btn"><a href="orderpay.html" class="ui-btn">填写收货人信息</a></div>
                    </div>
                </div>
            </div>
            <div class="exchange-item">
                <a href="javascript:;" class="block">
                    <div class="e-img"><img src="http://lorempixel.com/350/200"/></div>
                    <h2>2000积分兑换50元话费</h2>
                    <div class="good-cost">
                        <span class="coin">22000</span>
                        <span class="sep"></span>
                        <span class="price">2599<i>￥</i></span>
                    </div>
                    <div class="t-small">2016-02-10 15:10</div>
                    <div class="s-expand"></div>
                    <!--展开则加上 s-collapse 样式名-->
                </a>
                <div class="exchange-more">
                    <span class="arr"></span>
                    <!--该订单无效，已取消……纯文字显示-->
                    <h2 class="msg-text">已取消</h2>
                </div>
            </div>

            <div class="exchange-item">
                <a href="javascript:;" class="block">
                    <div class="e-img"><img src="http://lorempixel.com/350/200"/></div>
                    <h2>2000积分兑换50元话费</h2>
                    <div class="good-cost">
                        <span class="coin">22000</span>
                        <span class="sep"></span>
                        <span class="price">2599<i>￥</i></span>
                    </div>
                    <div class="t-small">2016-02-10 15:10</div>
                    <div class="s-expand s-collapse"></div>
                </a>
                <div class="exchange-more">
                    <span class="arr"></span>
                    <!--订单后续操作-->
                    <div class="action">
                        <h2>订单未支付</h2>
                        <div class="exchange-btn">
                            <a href="orderpay.html" class="ui-btn">立即支付</a>
                            <a href="javascript:;" class="ui-btn">取消订单</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>

    </div>
</div>
</body>
</html>